<div class="login-bg">
  <div class="login-area">
    <nz-tabset [nzSize]="'small'">
      <nz-tab nzTitle="登录">
        <div class="form-item">
          <form style="width:80%;" nz-form [formGroup]="validateForm" (ngSubmit)="submitLoginForm()">
            <nz-form-item>
              <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="username">用户名</nz-form-label>
              <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="Please input your username!">
                <nz-input-group nzPrefixIcon="user">
                  <input formControlName="username" nz-input placeholder="Username" id="username" />
                </nz-input-group>
              </nz-form-control>
            </nz-form-item>
            <nz-form-item>
              <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="password" nzRequired>密码</nz-form-label>
              <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="Please input your Password!">
                <nz-input-group nzPrefixIcon="lock">
                  <input formControlName="password" nz-input type="password" placeholder="Password" id="password" />
                </nz-input-group>
              </nz-form-control>
            </nz-form-item>
            <nz-form-item>
              <nz-form-control>
                <button style="width:100%;" nz-button nzType="primary">登录</button>
              </nz-form-control>
            </nz-form-item>
          </form>
        </div>
      </nz-tab>
      <nz-tab nzTitle="注册">
        <div class="form-item">
          <form style="width:80%;" nz-form [formGroup]="registerForm" (ngSubmit)="submitRegisterForm()">
            <nz-form-item>
              <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="username">用户名</nz-form-label>
              <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入您的用户名!">
                <nz-input-group nzPrefixIcon="user">
                  <input formControlName="username" nz-input placeholder="Username" id="username" />
                </nz-input-group>
              </nz-form-control>
            </nz-form-item>
            <nz-form-item>
              <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="password" nzRequired>密码</nz-form-label>
              <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入您的密码!">
                <nz-input-group nzPrefixIcon="lock">
                  <input formControlName="password" nz-input type="password" placeholder="Password" id="password" />
                </nz-input-group>
              </nz-form-control>
            </nz-form-item>
            <nz-form-item>
              <nz-form-control>
                <button style="width:100%;" nz-button nzType="primary">注册</button>
              </nz-form-control>
            </nz-form-item>
          </form>
        </div>
      </nz-tab>
    </nz-tabset>
  </div>
</div>
